<script setup lang="ts">
import type { ChannelItem } from '@/types';


defineProps<{
  channels:ChannelItem[]
  activeId:number
}>()
const emits = defineEmits<{
  "updateActiveId":[activeId:number]
}>()
</script>

<template>
  <div class="channel-nav">
    <nav class="list">
      <a
        class="item"
        :class="{active:item.id === activeId}"
        href="javascript:;"
        v-for="item in channels"
        :key="item.id"
        @click="emits('updateActiveId',item.id)"
      >
        {{ item.name}}
      </a>
    </nav>
  </div>
</template>